import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import BottomTab from '../../components/BottomTab';
import Login from '../../components/Login';
import UserBackground from '../../assets/image/user-bg.png';
import { AtList, AtListItem } from "taro-ui"
import { AtIcon } from 'taro-ui'
import api from '../../service/api';

import './index.less'

export default class UserCenter extends Component {

  config = {
    navigationBarTitleText: ''
  }

  constructor(){
    super(...arguments)
    this.state = {
        loginInfo:{},
        nowCount:'',
        currentTab: 1
    }
  }

  componentDidShow = () => {
    this.setState({
      loginInfo:Taro.getStorageSync('loginInfo')
    })

    let params = {}
    params.userId = Taro.getStorageSync('loginInfo').userId
    api.get('/inquiry/find/currentCount',params).then(res=>{
      this.setState({
        nowCount:res.data.data.nowCount
      })
    })
  }

  goListItem(e){
    Taro.navigateTo({
      url:e
    })
  }


  render () {
    return (
      <View className='center'>
        <View className='center-top'>
          <View className='center-top-box'>
            <Image  className='center-top-photo' src={this.state.loginInfo.headImage}></Image>
            <View className='center-top-name'>{this.state.loginInfo.nickName}</View>
            <View className='center-top-btn' onClick={this.goListItem.bind(this,'/pages/payment/index')}>
              剩余<Text className='center-top-btn-number'>{this.state.nowCount}</Text>次问诊  去购买 <AtIcon prefixClass='icon' value='right' size='16' color='#fff'></AtIcon>
              </View>
          </View>
          <Image className='center-top-image' src={UserBackground}></Image>
        </View>
        <View className='center-main'>
          <AtList hasBorder={false}>
          <AtListItem
            title='我的问诊'
            arrow='right'
            onClick={this.goListItem.bind(this,'/pages/UserOrder/index')}
            iconInfo={{
              size: 20,
              color: '#453f49',
              prefixClass:'icon',
              value: 'list1',
            }}
             />
          <AtListItem
            title='意见反馈'
            arrow='right'
            onClick={this.goListItem.bind(this,'/pages/Feedback/index')}
            iconInfo={{
              size: 20,
              color: '#453f49',
              prefixClass:'icon',
              value: 'feedback',
            }}
             />
          </AtList>

          <View>
            <View className='at-article__h3 center-main-color-bdbcbe center-main-magin-top-100'>
              小程序版本：1.0.2
            </View>
            <View className='at-article__p center-main-color-bdbcbe'>
              专家问诊小程序线上诊疗等医疗相关服务由【量准(上海)医疗科技有限公司】提供。
            </View>
            <View className='at-article__p center-main-color-bdbcbe'>
              使用【专家问诊】即代表你完全接受我们的用户协议。
            </View>
          </View>
        </View>
        <View className='center-bottom'>
          <BottomTab tab={this.state.currentTab}></BottomTab>
          <Login></Login>
        </View>
      </View>
    )
  }
}

